<script setup lang="ts">
import { storeToRefs } from 'pinia'
import { useToolStore } from '../stores/tool'
import { computed, ref } from 'vue'
import router from '@/router'

const {
  selectedConda, rootUrl
} = storeToRefs(useToolStore())
const s1 = ref(false)
const s2 = ref(false)
const s3 = ref(false)
const download = () => {
  s1.value = false
  s2.value = false
  s3.value = false

  const downloadUrl = `${rootUrl.value}${selectedConda.value.url}`
  s1.value = true
  // 让python下载链接文件至本地特定文件夹
  if (window.pywebview) {
    window.pywebview.api.do('downloadFile', downloadUrl).then(() => {
      s2.value = true
    })
  }
  if (needUpdate) {
    window.pywebview.api.do('installFile', selectedConda.value.url).then(() => {
      s3.value = true
    })
  } else {
    s3.value = true
  }
}
const next = () => {
  console.log('选择需要安装的whl软件包（第三方类库）')
  router.push('/online/online3')
}

const needUpdate = computed(() => {
  if (selectedConda.value && selectedConda.value.exist) {
    return false
  } else {
    return true
  }
})
</script>

<template>
  <div>
    <div class="w-full flex-none text-center py-4">
      <label class="w-full text-xl">等待anaconda3就绪</label>
      <button @click="download"
              class="border-2 bg-green-100 border-black rounded border-lime-500 mx-4 px-4 hover:bg-green-300">开始
      </button>
      <button @click="next"
              class="border-2 bg-green-100 border-black rounded border-lime-500 mx-4 px-4 hover:bg-green-300">下一步
      </button>
    </div>
    <div>1. 获取anaconda下载路径：{{ rootUrl }} <span v-if="s1" class="bg-blue-100 px-2 mx-4">已完成</span></div>
    <div>2. 获取anaconda安装包：{{ rootUrl }} <span v-if="s2" class="bg-blue-100 px-2 mx-4">已完成</span></div>
    <div v-if="!needUpdate">3. 使用本地Anaconda版本，本机无需安装 <span v-if="s3"
                                                                       class="bg-blue-100 px-2 mx-4">已完成</span></div>
    <div v-if="needUpdate">3. 使用在线Anaconda版本，请等待下载安装...<span v-if="s3"
                                                                          class="bg-blue-100 px-2 mx-4">已完成</span>
    </div>
    <!--    <div>{{ selectedConda }}</div>-->

  </div>
</template>

<style scoped>

</style>